<template>
	<!-- 我的-自提核销-核销记录 -->
	<view class="Write-offRecords public">
		<view class="main">
			<view class="main-item" v-for="item in arr.list" :key="item.id">
				<view class="main-item-header flexjcsb">
					<view class="">
						<text>核销码：</text>
						<!-- <text>{{item.VerificationCode}}</text> -->
						<text>{{item.verify_code}}</text>
					</view>
					<view class="">
						<text>核销员：</text>
						<text>{{item.verifier_name}}</text>
					</view>
				</view>
				<view class="main-item-footer flexjcsb">
					<view class="commodity">
						<view class="commodity-item" v-for="(i,index) in item.item_array" :key="index">
							<view class="">
								<image :src="'https://songcan.xyct1688.com/' + i.img" mode=""></image>
							</view>
							<view class="commodity-item-title">
								<!-- {{item.title}} -->
								{{i.name}}
							</view>
						</view>
						<!-- <view class="commodity-item">
							<view class="">
								<image :src="item.image" mode=""></image>
							</view>
							<view class="commodity-item-title">
								{{item.title}}
							</view>
						</view> -->
					</view>
					<view class="priceNum" v-for="(i,index) in item.item_array" :key="index">
						<view class="">
							￥<text>{{i.price}}</text>
						</view>
						<view class="">
							共 <text>{{i.num}}</text> 件
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	const $api = require('@/utils/request.js').API
	export default {
		data(){
			return {
				arr: [
					// {
					// 	id: '1',
					// 	VerificationCode: '234567',
					// 	Verifier: '张三',
					// 	price:'29.8',
					// 	num:'2',
					// 	image: 'https://img2.baidu.com/it/u=373805894,1655627384&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
					// 	title: '芒果超人面面包',
					// }
				]
			}
		},
		onLoad() {
			this.writeOffRecords()
		},
		methods: {
			writeOffRecords(){
				$api.postWriteOffRecords({}).then(res => {
					this.arr = res.data.data
				})
			}
		}
	}
</script>

<style lang="less" scoped>
	.Write-offRecords {
		font-family: PingFang SC;
		font-weight: 400;
		background: #FDFDFD;
		.main {
			.main-item {
				width: 702rpx;
				height: 258rpx;
				background: white;
				// background: aqua;
				box-shadow: 0rpx 0rpx 6rpx 0rpx rgba(118,118,118,0.09);
				border-radius: 10rpx;
				margin: auto;
				// 核销码和核销员
				.main-item-header {
					// padding: 43rpx 26rpx 26rpx 25rpx;
					padding: 23rpx 26rpx 26rpx 25rpx;
				}
				// 商品展示和价格
				.main-item-footer {
					padding: 0 26rpx 0 26rpx;
					// 商品
					.commodity {
						display: flex;
						.commodity-item {
							width: 118rpx;
							// box-shadow: 0rpx 17rpx 30rpx 0rpx rgba(102,70,8,0.15);
							border-radius: 10rpx;
							margin-right: 16rpx;
							image {
								width: 118rpx;
								height: 100rpx;
							}
							.commodity-item-title {
								font-size: 20rpx;
								// font-weight: 400;
								color: #202020;
								// padding-bottom: 10rpx;
								overflow: hidden;
								white-space: nowrap;
								text-overflow: ellipsis;
							}
						}
					}
					// 价格
					.priceNum {
						text-align: right;
						view:first-child {
							font-size: 24rpx;
							// font-weight: 400;
							color: #373737;
							padding-bottom: 15rpx;
						}
						view:last-child {
							font-size: 20rpx;
							font-weight: 300;
							color: #888888;
						}
					}
				}
			}
		}
	}
</style>